const path = require('path')
const webpack = require('webpack')

module.exports = {
  mode: 'development',
  entry: {
    // vue相关的模块放在一个单独的chunk
    vue: ['vue', 'axios'],
    // 其他模块放在另外一个chunk
    other: ['jquery', 'lodash'],
  },
  // 动态链接库chunk.js的输出地址
  output: {
    // 输出的动态链接库的名称，[name]对应entry中的定义(vue和other)
    filename: '[name].dll.js',
    // 生成到dist目录下的dll目录
    path: path.resolve(__dirname, '..', 'dist', 'dll'),
    // 向外暴露出dll库，这样就可以通过script引入
    library: '_dll_[name]',
  },
  plugins: [
    // 通过webpack自带的DLLPlugin打包生成dll文件
    // 打包过程会生成一个manifest.json文件，告诉webpack哪些库不参与后续的打包，已经通过DLLPlugin实现打包过了
    new webpack.DllPlugin({
      // 动态链接库的库名，需要和output.libray保持一致
      // 该字段的值也是 manifest.json 文件中 name 的值
      // 例如 vue.manifest.json 中就有 "name": "_dll_vue"
      name: '_dll_[name]',
      // manifest.json 文件的 绝对路径（输出文件
      path: path.join(__dirname, '..', 'dist', 'dll', '[name].manifest.json'),
    }),
  ],
}
